<layout name="page" />
<block name="content">
	<div class="page-header">
		<h1>考勤查看</h1>
	</div>
	<div class="fc-toolbar">
		<div class="fc-left">
			<a id="btn_prev" class="btn"><i class="fa fa-chevron-left"></i></a>
			<a id="btn_next" class="btn"><i class="fa fa-chevron-right"></i></a>
			<a id="btn_today" class="btn">今天</a>
		</div>
		<div class="fc-clear"></div>
	</div>
	<div id="calendar"></div>
</block>
<block name="js">
	<script type="text/javascript">
		layui.use(['global'], function() {
			var $ = layui.jquery;
			layui.link('Public/layui/js/plugins/fullcalendar/css/fullcalendar.css');
			moment = "Public/layui/ext/fullcalendar/moment.min.js";
			fullcalendar = "Public/layui/ext/fullcalendar/fullcalendar.min.js";
			load_js(moment, function() {
				load_js(fullcalendar, function() {
					$('#calendar').fullCalendar({
						header : false,
						titleFormat : {
							month : 'YYYY年MMMM', // September 2009
							week : "MMM d[ yyyy]{ '&#8212;'[ MMM] d yyyy}", // Sep 7 - 13 2009
							day : 'dddd, MMM d, yyyy' // Tuesday, Sep 8, 2009
						},
						firstDay : 1,
						buttonText : {
							prevYear : '去年',
							nextYear : '明年',
							today : '今天',
							month : '月',
							week : '周',
							day : '日',
							type : '3'
						},
						timeFormat : '',
						dayNamesShort : ['周日', '周一', '周二', '周三', '周四', '周五', '周六'],
						monthNames : ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
						eventDrop : function(event, delta, revertFunc) {
							alert(event.title + " was dropped on " + event.start.format());
							if (!confirm("Are you sure about this change?")) {
								revertFunc();
							}
						},
						eventAfterAllRender : function(view) {
							$('#panel').html(view.title);
						},
						eventClick : function(event, jsEvent, view) {
							winopen('{:url("read")}&id=' + event.id, 560, 470);
						},
						events : function(start, end, timezone, callback) {
							$.ajax({
								url : '{:url("json")}',
								dataType : 'json',
								data : {
									// our hypothetical feed requires UNIX timestamps
									start_date : start.format('YYYY-MM-DD'),
									end_date : end.format('YYYY-MM-DD'),
									type : $('#type').val(),
								},
								success : function(doc) {
									var events = [];
									for (var s in doc) {
										if (doc[s].type == 'sign_in') {
											$sign_time = conv_int_to_date(doc[s].create_time).substr(10, 6);
											$msg = "签到 :" + $sign_time;
										}
										if (doc[s].type == 'sign_out') {
											$sign_time = conv_int_to_date(doc[s].create_time).substr(10, 6);
											$msg = "签退 :" + $sign_time;
										}
										if (doc[s].type == 'outside') {
											$sign_time = conv_int_to_date(doc[s].create_time).substr(10, 6);
											$msg = "外勤 :" + $sign_time;
										}
										events.push({
											id : doc[s].id,
											title : $msg,
											start : doc[s].sign_date, // will be parsed
											end : doc[s].sign_date // will be parsed
										});
									}
									callback(events);
								}
							});
						}
					});
				});
			});

			$('#btn_next').on('click', function() {
				$('#calendar').fullCalendar('next');
			});

			$('#btn_prev').on('click', function() {
				$('#calendar').fullCalendar('prev');
			});
			$('#btn_today').on('click', function() {
				$('#calendar').fullCalendar('today');
			});

			set_return_url(null);
		});

	</script>
</block>